<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Test DataGrid</title>

	<link rel="stylesheet" type="text/css"	href="../src/minjs.css"/>
	<script type="text/javascript" src="../src/core.js"></script>
	<script type="text/javascript" src="../src/element.js"></script>
	<script type="text/javascript" src="../src/table.js"></script>
	<script type="text/javascript" src="../src/dataset.js"></script>
	<!--script type="text/javascript" src="../src/formatter.js"></script-->
	<script type="text/javascript" src="../src/types.js"></script>
	<script type="text/javascript" src="../src/datagrid.js"></script>
	<script type="text/javascript" src="../src/event.js"></script>

	<script>
		
		function init(){
			
			// DataSet
			var ds = new minjs.DataSet();
			ds.addField("date", Date);
			ds.addField("number", Number);
			ds.addField("string", String);
			ds.addField("image", null);	// ???
			for(var i = 0; i < 15; i++)
				ds.addRecord({	"born": new Date(), 
								"age": 523, 
								"name": "Jane", 
								"pic": "img/user.gif"
							});
			
			// Grid
			var grid = new minjs.DataGrid();
			grid.addField(new minjs.DataGrid.DateField("Date of birth", "born", "dd/mm/yyyy"));
			grid.addField(new minjs.DataGrid.NumberField("Age", "age", {}, minjs.DataGrid.ColumnSummary.createTotalSum()));
			grid.addField(new minjs.DataGrid.Field("Name", "name"));
			grid.addField(new minjs.DataGrid.ImageField("", "pic", 16, 16));

			/*
			// Editable grid
			var egrid = new minjs.DataGrid();
			egrid.addField(new minjs.DataGrid.DateField("Date of birth", "born", "dd/mm/yyyy"));
			egrid.addField(new minjs.DataGrid.EditableNumberField("Age", "age", minjs.DataGrid.ColumnSummary.createTotalSum()));
			egrid.addField(new minjs.DataGrid.EditableField("Name", "name"));
			*/
			
			grid.renderDataSet(ds);
			//egrid.renderDataSet(ds);
			
			minjs.Element.get("grid").add(grid);	
			//minjs.Element.get("editable-grid").add(egrid);	
		}		
	</script>

</head>
<body onload="init();">
	<table>
		<tr><td>
			<div class="test-grid" id="grid"></div>
		</td><td>
			<div class="test-grid" id="editable-grid"></div>
		</td></tr>
	</table>
</body>
</html>
